<template>
<!-- 发起申请 跳转路径 <el-menu-item index="/leave"> -->
  <div>
    <el-row>
    <el-col :span="24">
        <div class="grid-content bg-purple-dark">
             <el-tabs v-model="activeName" style="margin-left:50px;padding-top:30px;">
                <el-tab-pane label="全部"  name="first">
                    <div style="padding-top:10px;">
                        假勤
                        <el-row style="padding-top:15px;">                      
                        <el-button plain @click="Leave"><i class="iconfont icon-rili" style="color:#1296db;font-size:25px;"></i><div class="button-zi">请假</div></el-button>&nbsp;
                        <el-button plain @click="Evection"><i class="iconfont icon-feijichucha" style="color:#67C23A;font-size:25px;"></i><div class="button-zi">出差</div></el-button>&nbsp;
                        <el-button plain @click="Overtime"><i class="iconfont icon-diannao" style="color:#1296db;font-size:25px;"></i><div class="button-zi">加班</div></el-button>&nbsp;
                        <el-button plain @click="GoOut"><i class="iconfont icon-xiaoqiche" style="color:#4bd0ea;font-size:25px;"></i><div class="button-zi">外出</div></el-button>
                        </el-row>
                    </div>
                    <div>
                      人事
                      <el-row style="padding-top:15px;">
                      <el-button plain ><i class="iconfont icon-ruzhishenpi" style="color:#f2c01b;font-size:25px;"></i><div class="button-zi">入职</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-zhuanzhengqueren" style="color:#e718ba;font-size:25px;"></i><div class="button-zi">转正</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-banlilizhi" style="color:#d81e06;font-size:28px;"></i><div class="button-zi">离职</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-jixiao" style="color:#1296db;font-size:25px;"></i><div class="button-zi">绩效</div></el-button>&nbsp;
                      <el-button plain @click="AddPositionManagement"><i class="iconfont icon-zhaopinxuqiu" style="color:#e718ba;font-size:25px;"></i><div class="button-zi">职位招聘</div></el-button>
                      <br/><br/>
                      <el-button plain ><i class="iconfont icon-kaoqindaka_daka" style="color:#1296db;font-size:25px;"></i><div class="button-zi">打卡补卡</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-tiaogang-" style="color:#1296db;font-size:25px;"></i><div class="button-zi">调岗申请</div></el-button>
                      </el-row>
                    </div>
                    <div>行政
                      <el-row style="padding-top:15px;">
                      <el-button plain ><i class="iconfont icon-huiyishi1" style="color:#1296db;font-size:25px;"></i><div class="button-zi">会议室预订</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-wupinguanli" style="color:#1296db;font-size:25px;"></i><div class="button-zi">物品领用</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-qinshibaoxiu" style="color:#1296db;font-size:28px;"></i><div class="button-zi">报修</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-road" style="color:#67C23A;font-size:28px;"></i><div class="button-zi">用章</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-xiaoqiche" style="color:#4bd0ea;font-size:25px;"></i><div class="button-zi">用车</div></el-button>
                      <br/><br/>
                      <el-button plain ><i class="iconfont icon-tongyongshenpi" style="color:#67C23A;font-size:25px;"></i><div class="button-zi">通用审批</div></el-button>
                      </el-row>
                    </div>
                    <div>财务
                       <el-row style="padding-top:15px;">
                      <el-button plain ><i class="iconfont icon-baoxiao" style="color:#f03232;font-size:25px;"></i><div class="button-zi">报销</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-feiyongshenqing" style="color:#67C23A;font-size:25px;"></i><div class="button-zi">费用申请</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-shiliangzhinengduixiang8" style="color:#4bd0ea;font-size:28px;"></i><div class="button-zi">付款</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-xinzenghetong" style="color:#1296db;font-size:25px;"></i><div class="button-zi">合同</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-caigou" style="color:#1296db;font-size:25px;"></i><div class="button-zi">采购</div></el-button>
                      <br/><br/>
                      <el-button plain ><i class="iconfont icon-jiekuan" style="color:#1296db;font-size:25px;"></i><div class="button-zi">活动经费</div></el-button>
                      </el-row>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="假勤" name="second">
                  假勤
                  <el-row style="padding-top:15px;">                      
                        <el-button plain @click="Leave"><i class="iconfont icon-rili" style="color:#1296db;font-size:25px;"></i><div class="button-zi">请假</div></el-button>&nbsp;
                        <el-button plain @click="Evection"><i class="iconfont icon-feijichucha" style="color:#67C23A;font-size:25px;"></i><div class="button-zi">出差</div></el-button>&nbsp;
                        <el-button plain @click="Overtime"><i class="iconfont icon-diannao" style="color:#1296db;font-size:25px;"></i><div class="button-zi">加班</div></el-button>&nbsp;
                        <el-button plain @click="GoOut"><i class="iconfont icon-xiaoqiche" style="color:#4bd0ea;font-size:25px;"></i><div class="button-zi">外出</div></el-button>
                  </el-row>
                </el-tab-pane>
                <el-tab-pane label="人事" name="third">
                  人事
                      <el-row style="padding-top:15px;">
                      <el-button plain ><i class="iconfont icon-ruzhishenpi" style="color:#f2c01b;font-size:25px;"></i><div class="button-zi">入职</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-zhuanzhengqueren" style="color:#e718ba;font-size:25px;"></i><div class="button-zi">转正</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-banlilizhi" style="color:#d81e06;font-size:28px;"></i><div class="button-zi">离职</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-jixiao" style="color:#1296db;font-size:25px;"></i><div class="button-zi">绩效</div></el-button>&nbsp;
                      <el-button plain @click="AddPositionManagement"><i class="iconfont icon-zhaopinxuqiu" style="color:#e718ba;font-size:25px;"></i><div class="button-zi">职位招聘</div></el-button>
                      <br/><br/>
                      <el-button plain ><i class="iconfont icon-kaoqindaka_daka" style="color:#1296db;font-size:25px;"></i><div class="button-zi">打卡补卡</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-tiaogang-" style="color:#1296db;font-size:25px;"></i><div class="button-zi">调岗申请</div></el-button>
                      </el-row>
                </el-tab-pane>
                <el-tab-pane label="行政" name="fourth">行政
                  <el-row style="padding-top:15px;">
                      <el-button plain ><i class="iconfont icon-huiyishi1" style="color:#1296db;font-size:25px;"></i><div class="button-zi">会议室预订</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-wupinguanli" style="color:#1296db;font-size:25px;"></i><div class="button-zi">物品领用</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-qinshibaoxiu" style="color:#1296db;font-size:28px;"></i><div class="button-zi">报修</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-road" style="color:#67C23A;font-size:28px;"></i><div class="button-zi">用章</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-xiaoqiche" style="color:#4bd0ea;font-size:25px;"></i><div class="button-zi">用车</div></el-button>
                      <br/><br/>
                      <el-button plain ><i class="iconfont icon-tongyongshenpi" style="color:#67C23A;font-size:25px;"></i><div class="button-zi">通用审批</div></el-button>
                      </el-row>
                </el-tab-pane>
                <el-tab-pane label="财务" name="fourth1">财务
                   <el-row style="padding-top:15px;">
                      <el-button plain ><i class="iconfont icon-baoxiao" style="color:#f03232;font-size:25px;"></i><div class="button-zi">报销</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-feiyongshenqing" style="color:#67C23A;font-size:25px;"></i><div class="button-zi">费用申请</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-shiliangzhinengduixiang8" style="color:#4bd0ea;font-size:28px;"></i><div class="button-zi">付款</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-xinzenghetong" style="color:#1296db;font-size:25px;"></i><div class="button-zi">合同</div></el-button>&nbsp;
                      <el-button plain ><i class="iconfont icon-caigou" style="color:#1296db;font-size:25px;"></i><div class="button-zi">采购</div></el-button>
                      <br/><br/>
                      <el-button plain ><i class="iconfont icon-jiekuan" style="color:#1296db;font-size:25px;"></i><div class="button-zi">活动经费</div></el-button>
                      </el-row>
                </el-tab-pane>
            </el-tabs>
        </div> 
    </el-col>
    </el-row>
  </div>
</template>

<script>
import axios from 'axios'
export default {
     data(){
        return{
            activeName: 'first'
        }
     },
     created(){
      
     },
     methods: {
      Leave(){
        this.$router.push("/Leave"); //请假
      },
      Evection(){
        this.$router.push("/Evection"); //出差
      },
      Overtime(){
         this.$router.push("/Overtime"); // 加班
      },
      GoOut(){
        this.$router.push("/generalvehiclemanagement/generalvehicleoperation"); //外出
      },
      AddPositionManagement(){
        this.$router.push("/AddPositionManagement"); // 职位招聘
      }
     }
}
</script>

<style scoped>
.button-zi{
  padding-left: 45px;
  margin-top: -20px;
}
.el-button{
    width: 220px;
    height: 60px;
    color:black;
    text-align:left;
    font-size: 15px;
}
.el-row {
    margin-bottom: 20px;
   
  }
  .el-col {
    border-radius: 4px;
  }
  .bg-purple-dark {
    background: white;
    height: 800px;
    
  }
  .bg-purple {
    background: #f03232;
  }
  .bg-purple-light {
    background: #e5e9f2;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }
</style>